import React from 'react'
import { Form, Modal, Input, InputNumber, DatePicker, Select } from 'antd'

const FormItem = Form.Item
const Option = Select.Option

const Conditions = ({
  item = {},
  currentTenant,
  form: {
    getFieldDecorator,
    validateFields,
    getFieldsValue
  },
  onOk,
  ...modalProps
}) => {
  const formItemLayout = {
    labelCol: {
      xs: {
        span: 12
      },
      sm: {
        span: 6
      }
    },
    wrapperCol: {
      xs: {
        span: 12
      },
      sm: {
        span: 16
      }
    }
  };

  let queryParamJson = JSON.parse(item.queryParamJson);
  const config = {
    rules: [
      {
        required: true,
        message: '请输入条件'
      }
    ]
  };

  const handleOk = () => {
    validateFields((errors) => {
      if (errors) {
        return
      }
      const data = {
        ...getFieldsValue()
      };
      queryParamJson.map((condition, index) => {
        if (condition.type == 'date') {
          if (condition.isDayEndTime) {
            data[condition.testname] = data[condition.testname].endOf("day");
          }
          let selectedDate = new Date(data[condition.testname]).getTime();
          data[condition.testname] = selectedDate;
        }
      });
      // data.createTimeStart=1533052800000;
      // data.createTimeEnd=1534176000000;
      onOk(data);
    })
  }

  const modalOpts = {
    ...modalProps,
    onOk: handleOk
  }
  console.info(currentTenant)
  return (
    <Modal {...modalOpts}>
      <Form layout="horizontal">
        {queryParamJson.map((condition, index) => <FormItem
          key={condition.testname}
          label={condition.displayName}
          extra={condition.desc}
          {...formItemLayout}>
          {getFieldDecorator(condition.testname, {
            rules: [
              {
                required: condition.isRequired,
                message: '请输入条件'
              }
            ],
            initialValue: condition.displayName === '租户名' ? currentTenant.currentTenant : null
          })(
            (condition.type == 'date' && <DatePicker style={{ width: '100%' }} format='YYYY-MM-DD' />) ||
            (condition.type == 'string' && <Input placeholder={condition.displayName} disabled={condition.displayName === '租户名'} />) ||
            (condition.type == 'number' && <InputNumber style={{ width: '100%' }} placeholder={condition.displayName} />) ||
            (condition.type == 'select' && <Select><Option value="lucy">Lucy</Option></Select>))}
        </FormItem>)}
      </Form>
    </Modal>
  )
}

export default Form.create()(Conditions)
